<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<load href="__PUBLIC__/css/bootstrap.min.css" />
<load href="__PUBLIC__/css/main.css" />
<load href="__PUBLIC__/css/plate.css" />
<load href="__PUBLIC__/js/jquery-1.9.1.min.js" />
<load href="__PUBLIC__/js/main.js" />
	<script type="text/javascript">
		$(function(){
			var tmp =  $("select[name='template']");
			var t = $(this).find("option:selected").val();
			if(t != 'index9' && t != 'index10'){
				$(".tmp_n").hide();
			}
			tmp.change(function(){
				var tmp_val = $(this).find("option:selected").val();
				if(tmp_val == 'index9' || tmp_val == 'index10'){
					$(".tmp_n").show();
				}else{
					$(".tmp_n").hide();
				}
			})
		})
	</script>
</head>

<body>
<!-- 图片资源开始 -->
<div class="floatBackground" id="floatBackground" style="display: none;">
	<div class="bounced">
	<label class="closeImgResurces">X</label>
	<iframe id="imgResourcesiframe" src="{:rtrim(U('Upload/index'),'.html')}" width="750" height="465" frameborder="0" scrolling="auto"></iframe>
	</div>
</div>
<!-- 图片资源结束 -->
<!-- 模板页 -->
<div class="tpl_illustrate"><span>模板样式</span><iframe id="tpl_iframe" class="tpl_iframe" frameborder="0" scrolling="yes" src=""></iframe></div>
<div class="main-frame">
	<div class="position">华人码 > 创建华人码</div>
	<div class="addobject">
		<div class="obj-form">
			<form name="form1" id="typeform1" action="{:U('Type/typeadd')}" method="post" class="form-inline">
				<ul>
					<li>
						<label class="fl tle">码台标题：</label>
						<span class="fl cnt"><input name="typename" class="form-control" placeholder="标题"><em>*</em></span>
					</li>
					<li>
						<label class="fl tle">模板选择：</label>
				    	<span class="fl cnt">
					    	<select name="template" class="template form-control" style="width: 300px; padding: 0px 6px;">
								<volist name="tpl" id="v">
									<in name="v['key']" value="$Think.session.userinfo.tplrbac">
										<option value="{$v['idx']}">{$v['name']}{$v['des']}</option>
									</in>
								</volist>
							</select>
							<em>*</em>
				    	</span>
					</li>
					<!--<li>
						<label class="fl tle">domainID：</label>
						<span class="fl cnt"><input name="domainid" class="form-control" placeholder="domainid"><em> <font>关联旧版的domainID</font></em></span>
					</li>-->
					<li class="tmp_n oline" style="width:100%;"><span class="dividerline"></span></li>
					<li class="tmp_n"><label class="fl tle" style="font-weight: bold; font-size: 16px; width: 600px;">选择模块（点击模块可在右侧预览效果）</label></li>
					<li class="tmp_n">
						<label class="fl tle">模块名称：</label>
						<span class="fl cnt" style="display:block; overflow:auto; height:500px; width:600px;">


								<style type="text/css">
									span.plate_province{line-height: 36px; margin-top: 0px; font-size: 14px; font-weight: normal;}
									span.plate_province em{font-style:normal; display: block; clear: both; margin-left: 20px; font-weight: normal; color: #606060;}
									span.plate_province em.em10{margin-left: 45px;}
									span.plate_province em.em20{margin-left: 65px;}
									.obj-form li span.plate_province em{color: #606060;}
									.plate_outline{margin-top: 0px;}
									.plate_title{margin-bottom: 0px;}
									.plate_outline{padding-top: 0px;}
									.select_p{cursor: pointer;}
									.select_p.red{color: #ff5454; font-weight: bold;}
									.select_p.red *{color: #ff5454; font-weight: bold;}
									.obj-form .select_p.red em{color: #ff5454;}
								</style>
								<div class="plate_all">
									<div class="plate_outline" style="margin-top: 0px;">★ 网络资源</div>
									<div class="plate_title">
										<ul>
											<volist name="data" id="v">
												<if condition="$v['plate_type'] eq 1">
													<li class="select_p <in name="v['id']" value="$result.plate_id"> red</in>" plate_type="1" bannerimg="{$v['plate_img']}" vla="{$v['id']}"><a>⊙ {$v['plate_name']}</a></li>
												</if>
											</volist>
										</ul>
									</div>

									<div class="plate_outline">★ 企业资源</div>
									<div class="plate_title">
										<ul>
											<volist name="data" id="v">
												<if condition="$v['plate_type'] eq 2">
													<div class="plate_frame">
														<span class="plate_province select_p <in name="v['id']" value="$result.plate_id"> red</in>" plate_type="2" bannerimg="{$v['plate_img']}" vla="{$v['id']}">● {$v['plate_name']}</span>
														<volist name="v['subplate']" id="list1">
															<span class="plate_province select_p <in name="list1['id']" value="$result.plate_id"> red</in>" plate_type="2" bannerimg="{$list1['plate_img']}" vla="{$list1['id']}"><em>⊙ {$list1['plate_name']}</em></span>
															<volist name="list1['subplates']" id="list2">
																<span class="plate_province select_p <in name="lsit2['id']" value="$result.plate_id"> red</in>" plate_type="2" bannerimg="{$list2['plate_img']}" vla="{$list2['id']}"><em class='em10'>⊙ {$list2['plate_name']}</em></span>
																<volist name="list2['subplates']" id="list3">
																	<span class="plate_province select_p <in name="list3['id']" value="$result.plate_id"> red</in>" plate_type="2" bannerimg="{$list3['plate_img']}" vla="{$list3['id']}"><em class='em20'>⊙ {$list3['plate_name']}</em></span>
																</volist>
															</volist>
														</volist>
													</div>
												</if>
											</volist>
										</ul>
									</div>

									<div class="plate_outline">★ 政府资源</div>
									<volist name="data" id="v">
										<if condition="$v['plate_type'] eq 3">
											<div class="plate_frame">
												<span class="plate_province select_p <in name="v['id']" value="$result.plate_id"> red</in>" plate_type="3" bannerimg="{$v['plate_img']}" vla="{$v['id']}">● {$v['plate_name']}</span>
												<volist name="v['subplate']" id="list1">
													<span class="plate_province select_p <in name="list1['id']" value="$result.plate_id"> red</in>" plate_type="3" bannerimg="{$list1['plate_img']}" vla="{$list1['id']}"><em>⊙ {$list1['plate_name']}</em></span>
													<volist name="list1['subplates']" id="list2">
														<span class="plate_province select_p <in name="list2['id']" value="$result.plate_id"> red</in>" plate_type="3" bannerimg="{$list2['plate_img']}" vla="{$list2['id']}"><em class='em10'>⊙ {$list2['plate_name']}</em></span>
														<volist name="list2['subplates']" id="list3">
															<span class="plate_province select_p <in name="list3['id']" value="$result.plate_id"> red</in>" plate_type="3" bannerimg="{$list3['plate_img']}" vla="{$list3['id']}"><em class='em20'>⊙ {$list3['plate_name']}</em></span>
														</volist>
													</volist>
												</volist>
											</div>
										</if>
									</volist>
								</div>
								<input type="hidden" name="plate_id" value="{$result.plate_id}">
								<script type="text/javascript">
									$(function(){
										$(".select_p").each(function(index, element) {
											var t = $(this);
											t.click(function(){
												var val = $(this).attr("vla");
												var platetype = $(this).attr("plate_type");
												if(platetype == 3){
													$("#tpl_iframe").contents().find(".zhengfu").show();
													var carousel_inner = $( "#tpl_iframe" ).contents().find(".carousel-inner");
													if($(this).is(".red")){
														carousel_inner.find(".zf_"+val).remove();
													}else{
														var bannerimg = $(this).attr("bannerimg");
														carousel_inner.append("<div class=\"item active zf_"+val+"\"><img src=\""+bannerimg+"\" class=\"slide-image\"/></div>");
													}
												}else if(platetype == 1){
													if(t.is(".red")){
														$( "#tpl_iframe" ).contents().find(".p_"+val).hide();
													}else{
														$( "#tpl_iframe" ).contents().find(".p_"+val).show();
													}
												}else if(platetype == 2){
													if(t.is(".red")){
														remove_info(val);
													}else{
														get_customresoure(val);
													}
												}
												if(t.is(".red")){
													t.removeClass("red");
												}else{
													t.addClass("red");
												}
												get_plateid();
											})
										});

										//获取选中的版块ID
										function get_plateid(){
											var plate_id = "";
											$(".red").each(function(index, element) {
												var t = $(this);
												var val = t.attr("vla");
												plate_id += val+",";
											});
											$("input[name='plate_id']").val(plate_id);
										}

										//获取自定义资源内容
										function get_customresoure(val){
											var url = "/Admin/Index/get_palte_subinfo";
											var data = {
												"plate_id":val,
												random:Math.random()
											};
											$.ajax({
												url:url,
												data:data,
												type:"POST",
												dataType:"JSON",
												success:function (data){
													get_subinfo(data);
												},
											});
										}

										//循环读取内容信息
										function get_subinfo(data){
											var customplate = $("#tpl_iframe").contents().find(".customplate");
											var str2 = '';
											var str1 = "<div class=\"plate_construction\" type_id='"+data.id+"' style=\"display:block;\"><div class=\"m10\"><div class=\"plate_title\"><h3>"+data.plate_name+"</h3><a>更多>></a></div><div class=\"p_float p_jxuan\"><ul>";
											var subinfo = data.subinfo;
											$.each(subinfo, function(i, item) {
												str2 += "<li><a><span class=\"p_img\"><img src="+item.pic+" height=\"90\"></span><span class=\"p_txt\"><h3>"+item.title+"</h3><label>"+item.description+"</label></span></a></li>";
											});
											var str3 = "</ul></div></div></div>";
											var str4 = str1+str2+str3;
											customplate.append(str4);
										}
										//移除元素
										function remove_info(id){
											var customplate = $("#tpl_iframe").contents().find(".customplate");
											customplate.find(".plate_construction").each(function(index, element) {
												var t = $(this);
												var typeid = t.attr("type_id");
												if(typeid == id){
													t.remove();
												}
											});
										}

									})
								</script>



						</span>

					</li>


					<li class="oline" style="width:100%;"><span class="dividerline"></span></li>
					<li style="display: none;">
						<label class="fl tle">导航显示：</label>
						<span class="fl cnt">
							<input class="radio" type="radio" name="isbottom" value="1"> 下
							&nbsp;&nbsp;&nbsp;&nbsp;<input class="radio" type="radio" name="isbottom" value="0" checked="checked"> 上
							&nbsp;&nbsp;&nbsp;&nbsp;<input class="radio" type="radio" name="isbottom" value="2" checked="checked"> 都不显示
						</span>
					</li>
					<li class="submit">
						<label class="fl tle">&nbsp;</label>
						<span class="fl cnt"><input type="submit" value="创 建" class="submitbtn" /> <a href="{:U('Index/main')}">取消并查看列表</a></span>
					</li>
				</ul>
			</form>
		</div>
		<div class="obj-previewimg"></div>
	</div>

</div>

</body>
</html>
